<template>
  <view class="contentBg">
<!--    <cu-custom bgColor="bg-yellow" :isBack="true">-->
<!--      <block slot="backText">返回</block>-->
<!--      <block slot="content">用户中心</block>-->
<!--    </cu-custom>-->
    <view class=''>
      <view class="cu-list menu-avatar">
        <view class="cu-item text-custom-bg" style="color: #333333;">
          <view class="cu-avatar round lg"
                @tap="showModal"
                :style="'background-image:url('+avatarUrl+');'"></view>
          <view class="content">
            <view class="text-white" v-if="userName!=''" >{{userName}}</view>
            <view class="text-white text-sm flex">
              <view v-if="userId!=undefined" class="text-cut">
                手机号码：{{phone}}
              </view>
              <view v-if="!userId" class="text-cut text-white text-bold" open-type="getUserInfo" lang="zh_CN" @tap="getUserInfo">请先登录</view>
            </view>
          </view>
        <view  class="whiteColor" v-if="userId">&nbsp;&nbsp;&nbsp; <view  v-if="auditStatus==1">已认证</view><view v-else @tap="authInfo">&nbsp;&nbsp;请认证 >></view> &nbsp;&nbsp;&nbsp;</view>
        <view>&nbsp;&nbsp;&nbsp;  &nbsp;&nbsp;&nbsp;</view>
        </view>
      </view>
    </view>
    <user-statsitc></user-statsitc>

    <view class="cu-list menu sm-border card-menu padding-top">
      <view class="cu-item arrow" @tap="gotoUserInfo"  v-if="userId">
        <view class="content">
          <text class="cuIcon-list text-lg"/>
          <text class="text-left">个人信息</text>
        </view>
      </view>
      <view class="cu-item arrow" @tap="myShop">
        <view class="content">
          <image src="@/static/images/user/shop.png" class="png" mode="aspectFit"></image>
<!--          <text class="cuIcon-list text-lg"/>-->
          <text class="text-left">我的商户</text>
        </view>
      </view>
      <view class="cu-item arrow" @tap="myOrder">
        <view class="content">
          <image src="@/static/images/user/order.png" class="png" mode="aspectFit"></image>
<!--          <text class="cuIcon-list text-lg"/>-->
          <text class="text-left">我的订单</text>
        </view>
      </view>

      <view class="cu-item arrow" @tap="myVerifyOrder">
        <view class="content">
          <image src="@/static/images/user/verify.png" class="png" mode="aspectFit"></image>
<!--          <text class="cuIcon-list text-lg"/>-->
          <text class="text-left">我的核销</text>
        </view>
      </view>
<!--      <view class="cu-item arrow" @tap="myTeamUserList">-->
<!--        <view class="content">-->
<!--          <text class="cuIcon-list text-lg"/>-->
<!--          <text class="text-left">团队客户</text>-->
<!--        </view>-->
<!--      </view>-->
      <view class="cu-item arrow" @tap="helpCenter">
        <view class="content">
          <image src="@/static/images/user/help.png" class="png" mode="aspectFit"></image>
<!--          <text class="cuIcon-list text-lg"/>-->
          <text class="text-left">帮助中心</text>
        </view>
      </view>

      <view class="cu-item">
        <view class="content">
          <image src="@/static/images/user/version.png" class="png" mode="aspectFit"></image>
<!--          <text class="cuIcon-apps text-lg"/>-->
          <text class="text-left">当前版本</text>
        </view>
        <view class="action">
          <text>V{{version}}</text>
        </view>
      </view>

<!--      <view class="cu-item arrow" @tap="aboutUs">-->
<!--        <view class="content">-->
<!--          <text class="cuIcon-info text-lg"/>-->
<!--          <text class="text-left">关于我们</text>-->
<!--        </view>-->
<!--      </view>-->
    </view>
  </view>
</template>

<script setup lang="ts">
import {onMounted, computed, reactive, ref} from 'vue'
import {onLoad, onReady, onShow} from '@dcloudio/uni-app';
import {useStore} from "@/common/store";
import { getUser, getWeixinOpenid, saveUser} from "../../common/api/user";
import UserStatsitc from "../../components/UserStatsitc.vue";
const store = useStore();

const token = computed(() => store.token)
const userId = computed(() => store.userId)
const userName = computed(() => store.userName)
const avatarUrl = computed(() => store.avatarUrl)
const phone = computed(() => store.phone)
const auditStatus = computed(() => store.auditStatus)

const oraUrlPage = ref('')
const redirectType = ref('')

const version = ref('1.0.0')

const mpGetUserInfo = (result) => {
  console.log('mpGetUserInfo', result);
}


const initLogin = () => {
  if ((!userId.value) || userId.value ==0) {
    uni.showToast({
      icon: 'none',
      duration: 3000,
      title: `您还没有登录，请先登录！`
    });
  }
}

const myVerifyOrder = () => {
  initLogin();
  // 核销订单
  if(userId) {
    uni.navigateTo({
      url: `/pages/order/myVerifyOrderList`
    })
  }
};

const toMyIncome = () => {
  initLogin();
  uni.navigateTo({
    url: `/pages/user/myIncome`
  })

}

const myTeamUserList = () => {
  initLogin();
  // 核销订单
  if(userId) {
    uni.navigateTo({
      url: `/pages/user/myTeamUser`
    })
  }
};

const gotoUserInfo = () => {
	if(userId) {
		uni.navigateTo({
		  url: `/pages/user/userinfo`
		})
	}
}

const  helpCenter = () => {
  initLogin();
  uni.navigateTo({
    url: `/pages/user/helpList`
  })
}

const authInfo = () => {
  initLogin();
  uni.navigateTo({
    url: `/pages/user/authInfo`
  })
}

const myShop = () => {
  initLogin();
  uni.navigateTo({
    url: `/pages/shop/myShopList`
  })
}
const myOrder = () => {
  initLogin();
  uni.navigateTo({
    url: `/pages/order/myOrderList`
  })
}

const getUserInfo = () => {
  if (!token.value) {
    setTimeout(() => {
      // uni.authorize({
      //   scope: 'scope.userInfo',
      //   success() {
      uni.login({
        provider: 'weixin',
        // "onlyAuthorize": true, // 微信登录仅请求授权认证
        success: function (loginRes) {
          getWeixinOpenid(loginRes).then(res => {
          if(res && res.data && res.data.openid) {
             let openID = res.data.openid;
             console.log('openId:',openID)
             token.value = openID
            if (openID) {
                // 登录
                getUserStore(openID)
            } else {
              uni.showToast({
                icon: 'none',
                duration: 5000,
                title: '获取用户失败,请重试!'
              })
            }
          }
        });
		  }
    });
      // }
      // })
    }, 1000);
  }
}

const getUserStore = async (openid) => {
  await getUser(openid).then(r => {
    if(r && r.data) {
      let res = r.data
      console.log('res:',res)
      console.log('auditStatus:',res.auditStatus)
      store.$patch({
        avatarUrl: res.url,
        userId: res.id,
        userName: res.name,
        hasLogin: true,
        phone: res.phone,
        token: openid,
        auditStatus:res.auditStatus,
        adminLevel: res.adminLevel,
        adminLevelName: res.adminLevelName,
        qrcode: res.qrcode,
        promoCode: res.promoCode,
        promoCodeUrl: res.promoCodeUrl,
        upgradePreLevel: res.upgradePreLevel,
        upgradeLevel: res.upgradeLevel,
        upgradeTime: res.upgradeTime,
        city: res.city,
        ownerShop: res.ownerShop
      })
      console.log('auditStatus:',auditStatus.value)
    } else {
      store.$patch({
        avatarUrl: '',
        userId: '',
        userName: '',
        hasLogin: false,
        phone: '',
        auditStatus:0,
        adminLevel: 0,
        adminLevelName: '',
        qrcode: '',
        promoCode: '',
        promoCodeUrl: '',
        upgradePreLevel: '',
        upgradeLevel: '',
        upgradeTime: '',
        city: '',
        ownerShop: {
          poiId: '',
          poiName: '',
          address:'',
          cardType:'',
          cardStartTime:'',
          cardEndTime:'',
          corporation: '',
          corporationPhone: '',
          storePhone: '',
          businessLicense: '',
          sanitaryLicensePhoto: '',
          sanitaryLicensePhotos: [],
          dredgeDouyin: '',
          dredgeBuy: '',
          businessLicensePhoto: '',
          businessLicensePhotos: [],
          corporationPhoto: '',
          corporationPhotos: [],
          corporationCard: '',
          corporationCardBank: '',
          doorPhoto: '',
          doorPhotos: [],
          evnPhoto: '',
          evnPhotos: [],
          douyinPhoto: '',
          douyinPhotos: [],
          deliveryAddress: '',
          businessHour: ''
       }
      })
      uni.showToast({ //提示
        duration: 5000,
        title: '未查询到用户信息，请先注册！',
        success: function(res) {
          uni.navigateTo({
            url: `/pages/user/register?openid=` +openid + `&oraUrlPage=` +oraUrlPage.value+"&redirectType="+redirectType.value
          })
        }
      })
    }
  }).catch(e=>{

  })
}

const myTeam = () => {
  initLogin();
  uni.navigateTo({
    url: `/pages/user/myTeam`
  })
}



onLoad((options) => {
  oraUrlPage.value = options.oraUrlPage
  redirectType.value = options.redirectType
})

onMounted(async () => {
  console.log('token:',token.value)
  if (token.value) {
    await getUserStore(token.value)
  }
})

</script>

<style lang="scss" scoped>
.ucenter-bg {
  /*background-color: #66ccff;*/
  height: 250rpx;
  display: flex;
  justify-content: center;
  padding-top: 40rpx;
  overflow: hidden;
  position: relative;
  flex-direction: column;
  align-items: center;
  color: #fff;
  font-weight: 300;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
}

.ucenter-bg text {
  opacity: 0.8;
}

.ucenter-bg image {
  width: 200rpx;
  height: 200rpx;
}

.whiteColor {
  font-size: 26rpx;
  color: white;
}

.leftView {
  color: #999999;
  font-size: 20rpx;
}

.syView{
  text-align: center;
  .szView {
    font-size: 50rpx;
  }
  .tsView {
    margin-top: 16rpx;
    font-size: 24rpx;
    color: #999999;
  }
}


.page {
  height: 100Vh;
  width: 100vw;
}

.page.show {
  overflow: hidden;
}

.switch-sex::after {
  content: "\e716";
}

.switch-sex::before {
  content: "\e7a9";
}

.switch-music::after {
  content: "\e66a";
}

.switch-music::before {
  content: "\e6db";
}
</style>
